<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>BON CAKE官网-高颜值的甜</title>
    <link rel="shortcut icon" href="https://www.boncake.com.cn/public/app/site/statics/logol.ico">
    <link rel="stylesheet" href="../css/zzh_reset.css">
    <link rel="stylesheet" href="../css/zzh_shop.css">
    <style>
        #header{
            overflow: hidden;
            width: 100%;
            height: 120px;
        }
        #footer{
            /* overflow: hidden; */
            width: 100%;
            height: 250px;
            margin-top: 20px;
        }
    </style>
</head>

<body>
    <div id="header"></div>
    <form action="">
        <!-- 购物车标题 -->
        <div class="shop-wrapper">
            <h2 class="shop-title">购物车</h2>
            <div>
                <!-- 购物车主体 -->
                <table class="table-wrapper">
                    <!-- 表头部分 -->
                    <thead>
                        <tr class="table-header" width="1173">
                            <td width="18">
                                <label for="" class="check-label">
                            <input type="checkbox" name="" id="all" class="check-input">
                            <i></i>
                        </label>
                            </td>
                            <td width="172">商品</td>
                            <td width="193"></td>
                            <td width="210">生日牌/数字蜡烛</td>
                            <td width="152">单价</td>
                            <td width="135">数量</td>
                            <td width="125">金额</td>
                            <td width="168">操作</td>
                        </tr>
                        <!-- 表身部分 -->
                    </thead>
                    <tbody>
                        <!-- <tr class="table-body" width="1173">
                            <td width="18">
                                <label for="" class="check-label">
                            <input type="checkbox" name="" class="dx" class="check-input">
                            <i></i>
                        </label>
                            </td>
                            <td width="172">
                                <div class="pic-group">
                                    <a href="" target="_blank"><img src="https://www.boncake.com.cn/public/images/c8/2c/66/c45b8c3b0d83bb36ae0fb5f0f8d23212880984a9.jpg?1602319813#h" alt="" class="pic-img"></a>
                                </div>
                            </td>
                            <td width="193">
                                <div class="des-group">
                                    <div class="desc-name">
                                        <span>凡尔赛花园</span>
                                    </div>
                                    <div class="desc-size">
                                        <span>尺寸：6寸</span>
                                    </div>
                                    <div class="desc-gift">
                                        <span>含餐具5套</span>
                                    </div>
                                </div>
                            </td>
                            编辑选择部分
                            <td width="210">
                                <div class="select-group">
                                    <div class="select-mock">
                                        <div class="select-box">编辑或选择</div>
                                        <input type="hidden" name="" value="">
                                        <img src="https://www.boncake.com.cn/themes/boncake/images/img/pull-down.png" alt="" class="select-img">
                                        <ul class="option-mock">
                                            <li class="option-item">
                                                <span class="option-txt">编辑或选择</span>
                                            </li>
                                            <li class="option-item">
                                                <span class="option-txt">生日快乐</span>
                                            </li>
                                            <li class="option-item">
                                                <span class="option-txt">happy birthday</span>
                                            </li>
                                            <li id="option-input" class="option-item last">
                                                <input type="text" placeholder="最多可写8个字" class="input-txt">
                                                <input type="button" value="确定" class="option-btn">
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </td>
                            <td width="152">
                                <div class="price-group">
                                    <span class="price-txt">238</span>
                                </div>
                            </td>
                            <td width="135">
                                <div class="number-group">
                                    <img src="https://www.boncake.com.cn/themes/boncake/images/img/input-icon.png" alt="" class="number-imgleft jian">
                                    <input type="text" class="number-input" value="1">
                                    <img src="https://www.boncake.com.cn/themes/boncake/images/img/input-icon.png" alt="" class="number-imgright jia">
                                </div>
                            </td>
                            <td width="125">
                                <div class="total-group">￥
                                    <span class="total-txt">238</span>
                                </div>
                            </td>
                            <td width="168">
                                <div class="del-group">
                                    <img src="https://www.boncake.com.cn/themes/boncake/images/img/close-icon.png" alt="" class="del-btn" id="xs">
                                </div>
                            </td>
                        </tr> -->
                    </tbody>
                </table>
            </div>
            <!-- 购物车底部 -->
            <div class="balance">
                <!-- 购物车底部左半部分 -->
                <div class="fl">
                    <div class="fl-title">
                        <span class="fl-on">配件商品</span>
                        <span>配单商品</span>
                    </div>
                    <!-- 配件商品 -->
                    <ul class="fl-active">
                        <li class="single-item">
                            <a href="https://www.boncake.com.cn/index.php/passport-login.html">
                                <div class="goods-pic">
                                    <img src="https://www.boncake.com.cn/public/images/7b/02/d2/d5c8154844398114d8a044a6acd0ffbd1b96e5fd.jpg?1448625957#h" alt="">
                                </div>
                            </a>
                            <div class="goods-des">
                                <p class="goods-name">Cutlies</p>
                                <p class="goods-type">餐具（5份装）</p>
                                <div class="goods-price">
                                    <span>￥</span> 5.00
                                    <a href="https://www.boncake.com.cn/index.php/passport-login.html">
                                        <button class="buy-btn">
                                            <img src="https://www.boncake.com.cn/themes/boncake/images/img/cart-white.png" alt="" class="buy-img">
                                            <span>购买</span>
                                        </button>
                                    </a>
                                </div>
                            </div>
                        </li>
                        <li class="single-item">
                            <a href="https://www.boncake.com.cn/index.php/passport-login.html">
                                <div class="goods-pic">
                                    <img src="https://www.boncake.com.cn/public/images/51/ad/98/694075f2abd696765a610abb55347a909acdd578.jpg?1535104818#h" alt="">
                                </div>
                            </a>
                            <div class="goods-des">
                                <p class="goods-name">Cankdle</p>
                                <p class="goods-type">数字蜡烛（下单请备注数字）</p>
                                <div class="goods-price">
                                    <span>￥</span> 5.00
                                    <a href="https://www.boncake.com.cn/index.php/passport-login.html">
                                        <button class="buy-btn">
                                            <img src="https://www.boncake.com.cn/themes/boncake/images/img/cart-white.png" alt="" class="buy-img">
                                            <span>购买</span>
                                        </button>
                                    </a>
                                </div>
                            </div>
                        </li>
                    </ul>
                    <!-- 配单商品 -->
                    <ul>
                        <li class="single-item">
                            <a href="https://www.boncake.com.cn/index.php/passport-login.html">
                                <div class="goods-pic">
                                    <img src="https://www.boncake.com.cn/public/images/99/88/5b/8320957dcc6ff5f219782f8a01338cf4669e72af.jpg?1564392406#h" alt="">
                                </div>
                            </a>
                            <div class="goods-des">
                                <p class="goods-name">Delivery</p>
                                <p class="goods-type">邮费【上海内环到中环】</p>
                                <div class="goods-price">
                                    <span>￥</span> 19.00
                                    <a href="https://www.boncake.com.cn/index.php/passport-login.html">
                                        <button class="buy-btn">
                                            <img src="https://www.boncake.com.cn/themes/boncake/images/img/cart-white.png" alt="" class="buy-img">
                                            <span>购买</span>
                                        </button>
                                    </a>
                                </div>
                            </div>
                        </li>
                        <li class="single-item">
                            <a href="https://www.boncake.com.cn/index.php/passport-login.html">
                                <div class="goods-pic">
                                    <img src="https://www.boncake.com.cn/public/images/60/66/a1/f15c818adc42280d9d37ab87d9ed7353a8d6a50c.jpg?1564392242#h" alt="">
                                </div>
                            </a>
                            <div class="goods-des">
                                <p class="goods-name">Delivery</p>
                                <p class="goods-type">邮费【上海中环到外环】</p>
                                <div class="goods-price">
                                    <span>￥</span> 29.00
                                    <a href="https://www.boncake.com.cn/index.php/passport-login.html">
                                        <button class="buy-btn">
                                            <img src="https://www.boncake.com.cn/themes/boncake/images/img/cart-white.png" alt="" class="buy-img">
                                            <span>购买</span>
                                        </button>
                                    </a>
                                </div>
                            </div>
                        </li>
                    </ul>
                </div>
                <!-- 购物车底部右半部分 -->
                <div class="fr">
                    <div class="goods-money">
                        <span class="goods-label">商品金额：</span>
                        <span class="money">￥248</span>
                    </div>
                    <div class="discount">
                        <span goods-label>优惠金额：</span>
                        <span class="money">￥0</span>
                    </div>
                    <div class="cut-line"></div>
                    <div class="sum-money">
                        <span goods-label>(订单可得积分248)合计：</span>
                        <span class="money color">￥248</span>
                    </div>
                    <a href="https://www.boncake.com.cn/index.php/passport-login.html">
                        <div class="balance-desc">活动 ：全场蛋糕满￥299 减￥25</div>
                    </a>
                    <button class="balance-btn">去结算</button>
                </div>
            </div>
        </div>
    </form>
    <br><br><br><br>
  
    <script src="../js/zzh_jquery-1.9.1.min.js"></script>
    <script src="../js/zzh_shop.js"></script>
</body>

</html>